@extends('admin.base')

@section('content')
    <div class="layui-card">
        <div class="layui-form layui-card-header layuiadmin-card-header-auto layui-form">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">管理员</label>
                    <div class="layui-input-block">
                        <select id="admin_id">
                            <option value="">请选择</option>
                            @foreach($user as $item)
                                <option value="{{$item->id}}">{{$item->name}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label" style="width: 100px">日期时间范围</label>
                    <div class="layui-input-inline" style="width: 300px !important;">
                        <input type="text" style="width: 300px !important;" class="layui-input created_at"
                               id="test-laydate-range-datetime" placeholder=" - ">
                    </div>
                </div>
                <div class="layui-inline">
                    <button class="layui-btn layuiadmin-btn-admin layui-btn-normal" id="user_search">
                        <i class="layui-icon layui-icon-search layuiadmin-button-btn "></i>搜 索
                    </button>
                </div>
            </div>
        </div>
        <div class="layui-card-body">
            <table id="dataTable" lay-filter="dataTable"></table>
        </div>
    </div>

@endsection
@section('script')
    @can('system.record')
        <script>
            layui.use(['layer', 'table', 'form', 'laydate'], function () {
                var layer = layui.layer;
                var table = layui.table;
                var laydate = layui.laydate;
                var where = {
                    sorts: {},
                    time: {},
                    is: []
                }
                laydate.render({
                    elem: '.created_at' //指定元素
                    , type: 'datetime'
                    , range: true
                });
                var load = layer.load();

                //用户表格初始化
                var dataTable = table.render({
                    elem: '#dataTable'
                    , height: 700
                    , url: "{{ route('system.record.data') }}" //数据接口
                    , where: where
                    , loading: false
                    , autoSort: false
                    , limits: [10, 15, 30]
                    , limit: 15
                    , page: {theme: '#1E9FFF'} //开启分页
                    , cols: [[ //表头
                        {field: 'id', title: 'ID', fixed: true, width: 60}
                        , {
                            field: "", title: '管理员', fixed: true, width: 180, templet: function (d) {
                                return d.admin.name;
                            }
                        }
                        , {field: 'req_url', title: '请求地址', width: 220}
                        , {field: 'req_display_name', title: '操作名称', width: 230}
                        , {field: 'req_param', title: '请求参数'}
                        , {field: 'rep_param', title: '返回参数'}
                        , {field: 'created_at', sort: true, title: '创建时间', width: 200}
                        , {
                            field: 'req_name', title: '操作回馈', fixed: 'right', width: 150, templet: function (d) {
                                try {
                                    var param = JSON.parse(d.rep_param);
                                }catch (e) {
                                    return '<div><span class="layui-badge ">异常</span></div>'
                                }
                                if (param.success) {
                                    return '<div><span class="layui-badge layui-bg-blue">成功</span></div>'
                                } else {
                                    return '<div><span class="layui-badge ">失败</span></div>'
                                }
                            }
                        }
                    ]],
                    done: function (res, curr, count) {
                        layer.closeAll();
                    }
                });

                //搜索点击事件
                $("#user_search").click(function () {
                    where.is = [];
                    where.time = {};
                    if ($("#admin_id").val() != '') {
                        where.is.push(['admin_id', $("#admin_id").val()]);
                    }
                    var value = $(".created_at").val();
                    if (value != '') {
                        value = value.split('-');
                        where.time.created_at = [value[0] +'-'+ value[1] +'-'+ value[2], value[3] +'-'+ value[4] +'-'+ value[5]];
                    }
                    var load = layer.load();
                    dataTable.reload();
                })

                //监听排序
                table.on('sort(dataTable)', function (obj) {
                    where.sorts = {};
                    where.sorts[obj.field] = obj.type;
                    var load = layer.load();
                    dataTable.reload();
                });

            })
        </script>
    @endcan
@endsection



